<template>
    <view>
        <view v-if="listData.length > 0">
            <view class="uni-list" v-for="(item,index) in listData" :key="index">
				<view class="uni-list-cell-pd itemTitle" @click="showCon(index)">
				<text class="icon_line_green"></text>
				<h4 style="display: inline-block;">{{item.title}}</h4></view>
				<view class="uni-list-cell-pd itemCon">
					<rich-text v-show="isShow && currIndex==index" :nodes="item.content"></rich-text>
				</view>
            </view>
        </view>
        <!-- <view v-else>无</view> -->
		<view class="noInfo_Img" v-else-if="showNoInfo">
		    <image src="../static/images/icon_lack_message@2x.png"></image>
		</view>
    </view>
</template>

<script>
    import { faqList } from '@/api/prescribing.js';
    export default {
        data() {
            return {
				showNoInfo: false,
                listData: [],//列表数据
                queryParams:{
                    type:4,
                },
				isShow:false,
				currIndex:0
            }
        },
        onLoad() {
            this.getFaqList();
        },
        methods: {
            goto(url) {
                uni.navigateTo({
                    url:url
                })
            },
			showCon(index) {
				if(this.isShow && this.currIndex ==index){
					this.isShow = false;
				}else{
					this.isShow = true;
				}
			    this.currIndex = index;

			},
            getFaqList() {
                uni.showLoading({title: '加载中'});
                faqList(this.queryParams).then(res => {

                    this.listData =res.data;
					if(res.data.length<=0){
					    this.showNoInfo = true;
					}
                    //console.log(this.listData);
                    uni.hideLoading();

                }).catch(res => {
                    uni.hideLoading();
					this.showNoInfo = true;
                    // console.log(res);
                });

            },
        }
    }
</script>

<style>
    .uni-list {
        /* margin-bottom: 30rpx; */
        background-color: #fff;
        position: relative;
        width: 100%;
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
    }
    .uni-list-cell-pd {
        padding: 20rpx 30rpx;
    }
	.itemTitle{
		font-size: 36rpx;
		color: #262628;
		border-bottom: 1rpx solid #F7F7F7;
	}
	.itemCon{
		font-size: 34rpx;
		color: #666666;
		padding: 0 40rpx;
		margin-top: 10rpx;
		text-align: justify;
		/* text-align-last: center; */
	}
	.icon_line_green{
		height: 25rpx;
		padding: 4rpx;
		border-top-right-radius: 40rpx;
		border-bottom-right-radius: 40rpx;
		background-color: #4FCBBF;
		display: inline-block;
		margin-right: 15rpx;
	}

</style>
